<template>
    <view class="edit_wrap">
        <!-- <NavBar title="代理商编辑信息" :isBack="true" :navBackground="'#ffffff'" :leftIconColor="'#0F67FF'"></NavBar> -->
        <view class="agent_info">
            <view class="info_title">
                <text></text>
                <text>代理商基本信息</text>
            </view>
            <view class="agent_id">代理商ID：{{ proxyDetail.Number }}</view>
            <view class="info_input">
                <view class="input_item">
                    <view class="item_title">上级代理商</view>
                    <view class="number_input">
                        <input placeholder="请输入代理商学号" border="none" v-model="proxyDetail.ParentProxyNumber"
                            placeholder-style="font-size: 25rpx;color: #C4CFDB;" />
                    </view>
                </view>
                <view class="input_item">
                    <view class="item_title">代理号</view>
                    <view class="number_input">
                        <input placeholder="请输入代理号" border="none" v-model="proxyDetail.UserName"
                            placeholder-style="font-size: 25rpx;color: #C4CFDB;" />
                    </view>
                </view>
                <view class="input_item">
                    <view class="item_title">年费代理商</view>
                    <u-switch v-model="proxyDetail.UserType" :activeValue="1" :inactiveValue="0" activeColor="#25C565"
                        inactiveColor="#FC5F5F" class="switch"></u-switch>
                </view>
                <view class="input_item">
                    <view class="item_title">代理商到期时间</view>
                    <view class="choose_time" @click="timeshow = true">
                        {{ proxyDetail.ProxyValidTime && !proxyDetail.ProxyValidTime.includes('0001') ?
                            proxyDetail.ProxyValidTime.slice(0, 10) : '请选择时间' }}</view>
                </view>
                <view class="input_item">
                    <view class="top">
                        <view class="item_title">给上级代理商单量提成</view>
                        <u-switch v-model="proxyDetail.OpenTiCheng" activeColor="#25C565"
                            inactiveColor="#FC5F5F"></u-switch>
                    </view>
                    <view class="bottom">
                        <input placeholder="请输入每单提成" border="none" v-model="proxyDetail.TiChengPrice"
                            placeholder-style="font-size: 25rpx;color: #C4CFDB;">
                        <text style="font-size: 26rpx;color: #64707D;">元</text>
                    </view>
                </view>
                <view class="input_item">
                    <view class="item_title">可下单其他产品</view>
                    <u-switch v-model="proxyDetail.AllowOtherProduct" activeColor="#25C565" inactiveColor="#FC5F5F"
                        class="switch"></u-switch>
                </view>
                <view class="input_item">
                    <view class="item_title">给上级代理商续费提成</view>
                    <view class="number_input">
                        <input placeholder="请输入提成金额" border="none" v-model="proxyDetail.RewalPrice"
                            placeholder-style="font-size: 25rpx;color: #C4CFDB;" />
                        <text class="yuan">元</text>
                    </view>
                </view>
                <view class="input_item">
                    <view class="item_title">单量提成</view>
                    <u-switch v-model="proxyDetail.ScanOrderTiCheng" activeColor="#25C565"
                        inactiveColor="#FC5F5F"></u-switch>
                </view>
            </view>
            <view class="info_title discount_title">
                <text></text>
                <text>各个题库折扣</text>
            </view>
            <view class="discount_list">
                <view class="list_item" v-for="(item, index) in discountList" :key="index">
                    <view class="book_name">
                        <img :src="item.icon" alt="">
                        <view class="name">{{ item.title }}</view>
                    </view>
                    <view class="book_price">
                        <u--input :placeholder="item.unit == '元' ? '请输入扶持金金额' : '请输入折扣价格'" border="none"
                            v-model="proxyDetail[item.prop]"
                            placeholder-style="font-size: 25rpx;color: #C4CFDB;"></u--input>
                        <text class="yuan">{{ item.unit }}</text>
                    </view>
                </view>
            </view>
        </view>
        <view style="height: 88rpx;"></view>
        <view class="saveinfo" @click="handleSave">保存信息</view>
        <u-datetime-picker :show="timeshow" v-model="time" mode="date" @confirm="confirmFun"
            @cancel="cancelFun"></u-datetime-picker>
    </view>
</template>
<script>
export default {
    data () {
        return {
            proxyDetail: {},
            number: '',
            annual: false,
            timeshow: false,
            time: Number(new Date()),
            giveroyalty: false,
            elsepro: false,
            discountList: [
                {
                    icon: "/static/img/hui.png",
                    unit: "元",
                    number: "",
                    title: "慧考智学网课",
                    prop: "HuiKaoBalance"
                },
                {
                    icon: "/static/img/ya.png",
                    unit: "元",
                    number: "",
                    title: "丫题丫题库",
                    prop: "QuestionBalance"
                },
                // {
                //     icon: "/static/img/book.png",
                //     unit: "折",
                //     number: "",
                //     title: "丫题丫督学",
                //     prop:""
                // },
                // {
                //     icon: "/static/img/book.png",
                //     unit: "折",
                //     number: "",
                //     title: "丫题丫网课"
                // },
                {
                    icon: "/static/img/book.png",
                    unit: "折",
                    number: "",
                    title: "金考典",
                    prop: "JinKaoDianDiscount"
                }, {
                    icon: "/static/img/book.png",
                    unit: "折",
                    number: "",
                    title: "毕过题库",
                    prop: "BiGuoDiscount"
                }, {
                    icon: "/static/img/book.png",
                    unit: "折",
                    number: "",
                    title: "魔考大师",
                    prop: "MoKaoDiscount"
                }, {
                    icon: "/static/img/book.png",
                    unit: "折",
                    number: "",
                    title: "阿虎医考",
                    prop: "AhuDiscount"
                }, {
                    icon: "/static/img/book.png",
                    unit: "折",
                    number: "",
                    title: "考试宝典",
                    prop: "TreasureDiscount"
                }, {
                    icon: "/static/img/book.png",
                    unit: "折",
                    number: "",
                    title: "考研专业课电子书",
                    prop: "ExamSpecializedDiscount"
                },
            ]
        }
    },
    methods: {
        // 选择时间
        confirmFun (e) {
            this.proxyDetail.ProxyValidTime = this.$timestampToDate(e.value)
            this.timeshow = false
        },
        //取消选择
        cancelFun () {
            this.timeshow = false
        },
        //保存
        handleSave () {
            this.proxyDetail.ParentProxyNumber = Number(this.proxyDetail.ParentProxyNumber)
            this.$http.put('wxuser/userinfo', this.proxyDetail).then(res => {
                if (res.Code == 200) {
                    this.$store.commit("setIsUpdate", true)
                    uni.showToast({ title: "修改成功" })
                    setTimeout(() => {
                        uni.navigateBack()
                    }, 1000);
                }
            })
        }
    },
    created () {
        this.proxyDetail = JSON.parse(JSON.stringify(this.$store.state.proxyDetail))
    }
}
</script>
<style lang="scss" scoped>
.edit_wrap {
    width: 100%;
    min-height: 100vh;
    background: #F6F8FC;
    padding: 32rpx 28rpx;
    box-sizing: border-box;
    position: relative;
}

.agent_info {
    padding-bottom: 88rpx;

    .info_title {
        display: flex;
        align-items: center;

        text {
            display: inline-block;

            &:nth-child(1) {
                width: 6rpx;
                height: 18rpx;
                background: linear-gradient(180deg, #1946F9 0%, #0F67FF 100%);
                border-radius: 200rpx;
                margin-right: 8rpx;
            }

            &:nth-child(2) {
                height: 40rpx;
                font-family: PingFang SC;
                font-weight: bold;
                font-size: 28rpx;
                color: #000;
                line-height: 40rpx;
            }
        }
    }

    .agent_id {
        margin-top: 30rpx;
        height: 44rpx;
        font-family: PingFang SC;
        font-weight: bold;
        font-size: 32rpx;
        color: #000000;
        line-height: 44rpx;
    }

    .info_input {
        //height: 680rpx;
        background: #FFFFFF;
        box-shadow: 0rpx 6rpx 12rpx rgba(0, 0, 0, 0.05);
        border-radius: 12rpx;
        padding: 0 28rpx;
        box-sizing: border-box;
        margin-top: 18rpx;

        .input_item {
            display: flex;
            padding: 28rpx 0;
            border-bottom: 1rpx solid #E5E5E5;

            &:not(:nth-child(5)) {
                justify-content: space-between;
                align-items: center;
            }

            &:nth-child(5) {
                display: flex;
                flex-direction: column;

                .top {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                }

                .bottom {
                    margin-top: 26rpx;
                    display: flex;
                    align-items: center;

                    input {
                        flex: 1;
                        margin-right: 8rpx;
                        text-align: right;
                    }
                }
            }

            &:last-child {
                border-bottom: 0;
            }

            .item_title {
                font-family: PingFang SC;
                font-size: 26rpx;
                color: #64707D;
            }

            .number_input {
                width: 208rpx;
                display: flex;
                align-items: center;
                flex: 1;

                input {
                    width: 100%;
                    text-align: right;
                }

                .yuan {
                    font-family: PingFang SC;
                    font-size: 26rpx;
                    color: #64707D;
                    margin-left: 8rpx;
                }
            }

            .choose_time {
                font-family: PingFang SC;
                font-size: 26rpx;
                // color: #C4CFDB;
            }
        }
    }

    .discount_title {
        margin-top: 34rpx;
    }

    .discount_list {
        margin-top: 30rpx;

        .list_item {
            width: 100%;
            height: 158rpx;
            background: #FFF;
            box-shadow: 0rpx 6rpx 12rpx rgba(0, 0, 0, 0.05);
            border-radius: 12rpx;
            margin-bottom: 18rpx;
            padding: 28rpx 26rpx;
            box-sizing: border-box;

            .book_name {
                height: 40rpx;
                display: flex;
                align-items: center;

                img {
                    display: inline-block;
                    width: 26rpx;
                    height: 32rpx;
                    margin-top: 4rpx;
                }

                .name {
                    margin-left: 16rpx;
                    font-family: PingFang SC;
                    font-weight: bold;
                    font-size: 28rpx;
                    color: #3D4353;
                }
            }

            .book_price {
                margin-top: 24rpx;
                height: 44rpx;
                display: flex;
                align-items: center;

                .yuan {
                    font-family: PingFang SC;
                    font-size: 26rpx;
                    color: #64707D;
                    margin-left: 8rpx;
                }
            }
        }
    }
}

.saveinfo {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 11;
    width: 100%;
    height: 88rpx;
    background: linear-gradient(180deg, #1946F9 0%, #0F67FF 100%);
    font-family: PingFang SC;
    font-size: 32rpx;
    color: #FFFFFF;
    text-align: center;
    line-height: 88rpx;
}
</style>